<script>
import { DOWN_LOAD_PIC, DOWN_LOAD_FULL, DOWN_LOAD_VIDEO, VR_COMPOUND_VIDEO, WATER_MARK } from '@/config/menuId';
import { menuHandler } from '@/handler/menuHandler';
import { downloadPic, getMemberPower, getOssfiles } from '@/api/user';
import { downLoadVideo, downLoadZip } from '@/utils/utilsNew';

const apparentOptionsList = [
  {
    title: '去除实勘牌',
    type: 'waterMark',
    menuId: WATER_MARK,
    matching: (row) => true,
    getId: (row) => row.houDelId,
    handler(row, type, id) {
      this.currentHouDelId = id;
      this.watermarkPopVisible = true;
    },
  },
  {
    title: '合成视频',
    type: 'vrToVideo',
    menuId: VR_COMPOUND_VIDEO,
    matching: (row) => true,
    getId: (row) => row.houDelId,
  },
  {
    title: '补充室内图',
    type: 'additionRoomImg',
    menuId: null,
    matching: (row) => row.houSubType == '1',
    getId: (row) => row.houDelId,
    handler(row, type, id) {
      if (this.vrDownLoadCheck(row) === true) {
        this.currentHouDelId = id;
        this.dialogUpdateImgVisible = true;
      }
    },
  },
];

const moreOptionsList = [
  {
    title: '修改',
    type: 'modify',
    matching: (row) => true,
    getId: (row) => row.houDelId,
  },
  {
    title: '下载图片',
    type: 'pic',
    menuId: DOWN_LOAD_PIC,
    matching: (row) => !!row.imgId,
    getId: (row) => row.houDelId,
  },
  {
    title: '下载全景图',
    type: 'pan',
    menuId: DOWN_LOAD_FULL,
    matching: (row) => row.sphereStatus == '10',
    getId: (row) => row.houDelId,
  },
  {
    title: '下载视频',
    type: 'vid',
    menuId: DOWN_LOAD_VIDEO,
    matching: (row) => row.videoMaterial && row.videoMaterial.videoId && row.videoStatus != '1',
    getId: (row) => row.videoMaterial.videoId,
  },
];

export default {
  name: 'OperateCollection',
  components: {},
  props: {
    houseInfo: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {};
  },
  created() {},
  mounted() {},
  watch: {},
  computed: {
    isNoMoreOptions() {
      return (row) => Object.values(moreOptionsList).every((item) => !item.matching(row));
    },
    ...mapGetters(['sessionUser']),
  },
  methods: {
    vrToVideoHandler(delId, videoMaterial) {
      let p =
        videoMaterial && videoMaterial.videoId
          ? this.$messageBox.confirm('重新上传视频会替换现有视频，是否继续？', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
            })
          : Promise.resolve();
      p.then(() => {
        this.$router.push({
          name: 'vrTurnVideo',
          params: { houDelId: delId, required: '0' },
        });
      });
    },

    /** 关于vr是否下载的校验 */
    vrDownLoadCheck(row) {
      let state = row.houSubTypeState;
      if (state == '1') {
        return this.$message.error('VR正在下载中，请等待VR下载完后使用～');
      }
      return true;
    },

    loadVideoHandler(delId, title, menuId) {
      getOssfiles(delId, title).then(({ data }) => {
        this.$message.success('已开始下载，请稍后~');
        downLoadVideo(data);
        getMemberPower({
          menuId: menuId,
          agentId: this.sessionUser.id,
        });
      });
    },

    loadimg(delId, type, title, menuId) {
      downloadPic({ delId, type }).then(({ data }) => {
        this.$message.success('已开始下载，请稍后~');
        downLoadZip(data, title);
        getMemberPower({
          menuId: menuId,
          agentId: this.sessionUser.id,
        });
      });
    },

    // 操作项（除更多操作之外的按钮）
    handleOptions(row, type, id, menuId, handler) {
      if (handler) {
        handler.apply(this, [...arguments]);
        return;
      }

      menuHandler
        .call(this, menuId)
        .then(() => {
          switch (type) {
            case 'vrToVideo':
              if (row.videoStatus == '1') {
                return this.$message.error('视频正在合成中，稍后再试～');
              }

              if (this.vrDownLoadCheck(row) === true) {
                this.vrToVideoHandler(id, row.videoMaterial);
              }

              break;
          }
        })
        .catch((error) => {});
    },

    /** 更多操作 */
    handleDownload({ delId, type, title, menuId, delegation_type }) {
      // 修改房源
      if (type == 'modify') {
        return;
      }

      menuHandler
        .call(this, menuId)
        .then(() => {
          switch (type) {
            // 下载视频
            case 'vid':
              this.loadVideoHandler(delId, title, menuId);

              break;

            // 视频重新配音
            case 'videoDubbed':
              if (row.videoStatus == '1') {
                return this.$message.error('视频正在合成中，稍后再试～');
              }
              if (!(row.videoMaterial && row.videoMaterial.videoId)) {
                return this.$message.error('暂无视频可配音，请上传或合成视频后再试～');
              }
              if (this.vrDownLoadCheck(row) === true) {
                this.$router.push({
                  name: 'vrTurnVideo',
                  params: { houDelId: delId, required: '1' },
                });
              }

              break;

            // 下载图片
            default:
              this.loadimg(delId, type, title, menuId);
              break;
          }
        })
        .catch((error) => {});
    },
  },
  render() {
    const { houseInfo: row } = this;

    const apparentNodes = apparentOptionsList
      .filter((item) => item.matching(row))
      .map((item) => {
        return (
          <el-button
            key={item.type}
            size="mini"
            type="text"
            onClick={this.handleOptions(row, item.type, item.getId(row), item.menuId, item.handler)}
          >
            {item.title}
          </el-button>
        );
      });

    const moreNodes = moreOptionsList
      .filter((item) => item.matching(row))
      .map((item) => {
        return (
          <el-dropdown-item
            key={index}
            command={{
              delId: item.getId(row),
              type: item.type,
              menuId: item.menuId,
              ...row,
            }}
          >
            {item.title}
          </el-dropdown-item>
        );
      });

    return (
      <div>
        {apparentNodes}

        {!this.isNoMoreOptions(row) ? (
          <el-dropdown on={{ command: this.handleDownload }} style="margin-left: 10px">
            <el-button size="mini" type="text">
              更多操作
              <i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">{moreNodes}</el-dropdown-menu>
          </el-dropdown>
        ) : null}
      </div>
    );
  },
};
</script>
<style></style>
